<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- <script src="https://res.wx.qq.com/mmbizwap/zh_CN/htmledition/js/vconsole/2.5.2/vconsole.min.js"></script> -->
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name=screen-orientation content=portrait>
    <meta name=apple-mobile-web-app-capable content=yes>
    <meta name=format-detection content="telephone=no">
    <meta name=full-screen content=yes>
    <meta http-equiv=X-UA-Compatible content="IE=edge">
    <meta name=renderer content=webkit>
    <meta http-equiv=Pragma content=no-cache>
    <meta http-equiv=Cache-Control content=no-cache>
    <meta http-equiv=Expires content=0>
    <meta name=x5-fullscreen content=true>
    <meta content=yes name=apple-mobile-web-app-capable>
    <meta content=yes name=apple-touch-fullscreen>
    <link rel="stylesheet" href="css/swiper.min.css">
    <meta content="telephone=no,email=no" name=format-detection>
    <title>生活的味道</title>
    <link rel="stylesheet" href="./css/index.css">
    <script src="js/jquery-1.10.1.min.js"></script>
    <script type="text/javascript" src="js/ckplayer.js"></script>
</head>
<script src="https://cdn.jsdelivr.net/npm/vue"></script>

<body>
    <div id='app'>
        <div class='top'>
            <div class="logo">
                <img src="./images/download.png">
            </div>
            <div class='name'>
                <p v-html="AppName"></p>
                <p>权威养生专家 为你开启生活的味道</p>
            </div>
            <div class='open'>
                <a href="http://gdtvnews.weixinmvp.top/download/download.html" v-html='open'></a>
            </div>
        </div>
        <div id="root"></div>
        <div class='container ' id="container" style="display: none;">
            <div class='Video' v-if='VideoMess'>
                <video width="100%" controls :poster="VideoMess.ThumbnailUrl[0]">
                    <source :src="VideoMess.AttachmentUrl[0]" type="video/mp4"> 您的浏览器不支持 video 标签。
                </video>
                <div class='detial'>
                    资料
                </div>
                <div class='content' v-html="VideoMess.Title">
                </div>
                <div class='detial'>
                    热门视频
                </div>
                <div class='RelevantVideo'>
                    <a href="http://gdtvnews.weixinmvp.top/download/download.html" v-for="attr in HotList">
                        <img :src="attr.PhotoUrl">
                        <div v-html="attr.ClassName">
                        </div>
                    </a>


                </div>
                <div class='detial' v-if='comment'>
                    精彩评论({{comment.length}})
                </div>
                <div class="comment" v-for="item in comment">
                    <a href="http://gdtvnews.weixinmvp.top/download/download.html">
                        <div>
                            <div>
                                <img :src="item.Icon">
                            </div>
                            <div>
                                <p v-html="item.Name"></p>
                                <p v-html="item.CommentDate"></p>
                            </div>
                            <div>
                                    <img src="./images/good.png">{{item.SecondCommentCount}}
                            </div>
                        </div>
                        <p v-html='item.Content'></p>
                    </a>
                </div>
            </div>
            <div class='articl' v-show='articleMess'>
                <div class='detial'>
                    热门资讯
                </div>
                <div class='RelevantVideo'>
                        <div class="swiper-container" id="topNav1">
                            <div class="swiper-wrapper">
                                <a href="http://gdtvnews.weixinmvp.top/download/download.html" v-for="attr in HotList" class="swiper-wrapper">
                        <img :src="attr.PhotoUrl">
                        <div>
                            {{attr.ClassName}}
                        </div>
                    </a>
                            </div>
                        
                        </div>
                </div>
                <div class='detial' v-if='comment'>
                    精彩评论({{comment.length}})
                </div>
                <div class="comment" v-for="item in comment">
                    <a href="http://gdtvnews.weixinmvp.top/download/download.html">
                        <div>
                            <div>
                                <img :src="item.Icon">
                            </div>
                            <div>
                                <p v-html="item.Name"></p>
                                <p v-html="item.CommentDate"></p>
                            </div>
                            <div>
                                    <img src="./images/good.png">{{item.SecondCommentCount}}
                            </div>
                        </div>
                        <p v-html="item.Content"></p>
                    </a>
                </div>
            </div>
            <div class='Livebroadcast' v-if="Live">
                <div id="video" style="width: 100%; "></div>
                <div class='detial1'>
                    <span style='border-bottom:2px solid red;color:red;' class='span1' @click='change1($event)'>课程详情</span><span @click='change($event)' class='span2'>探讨</span>
                </div>
                <div v-if='showCOm'>
                   <div v-html="Live.ClassName" class='VD'>
                </div>
                <div class='detial'>
                    课程推荐
                </div>
                <div class='RelevantVideo'>
                    <a href="http://gdtvnews.weixinmvp.top/download/download.html" v-for="attr in LiveLt">
                        <img :src="attr.PhotoUrl">
                        <div v-html="attr.ClassName">
                        </div>
                    </a>
                </div>
                </div>
                <div class="comment" v-for="item in LiveCOM" v-else >
                    <a href="http://gdtvnews.weixinmvp.top/download/download.html">
                        <div>
                            <div>
                                <img :src="item.Icon">
                            </div>
                            <div>
                                <p v-html="item.Name"></p>
                                <p v-html="item.CommentDate"></p>
                            </div>
                            <div>
                                    <img src="./images/good.png">{{item.SecondCommentCount}}
                            </div>
                        </div>
                        <p v-html="item.Content"></p>
                    </a>
                </div>
            </div>
            <div class='AtcLIst' v-if='ArticlList'>
                <div class="Atctop">
                    <p v-html="ArticlList.TopicInfo.Title"></p>
                    <img :src="ArticlList.TopicInfo.PhotoUrl">
                </div>
                <div class="content">
                    <h5>文章推荐</h5>
                    <a @click="click(item.Id)" v-for='item in ArticlList.DocList'>
                        <div v-if='item.ThumbnailUrl[0]'>
                            <div class="contentLeft">
                            <div v-html="item.Title">
                            </div>
                            <div>
                                <span v-html="item.Type"></span>&nbsp;|&nbsp;<span v-html="item.UpdateDate"></span>
                            </div>
                        </div>
                        <div class='contentRight'>
                            <img :src="item.ThumbnailUrl[0]">
                        </div>                        
                        </div>
                        <div v-else class='NoImg'>
                              <div class="contentLeft">
                            <div v-html="item.Title" class='nodiv'>
                            </div>
                            <div>
                                <span v-html="item.Type"></span>&nbsp;|&nbsp;<span v-html="item.UpdateDate"></span>
                            </div>
                        </div>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>
</body>
<!-- <script src="./js/jquery-3.2.1.js"></script> -->
<script src='./js/index.js'></script>

</html>
<script type="text/javascript">
// var mySwiper = new Swiper('#topNav', {
//     freeMode: true,
//     freeModeMomentumRatio: 0.5,
//     slidesPerView: 'auto',

// });
// console.log(mySwiper)
// var mySwiper = new Swiper('#topNav1', {
//     freeMode: true,
//     freeModeMomentumRatio: 0.5,
//     slidesPerView: 'auto',

// });
// console.log(mySwiper)
</script>